<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    {include file='public/main'}
    <link rel="stylesheet" href="/css/index.css">
    <title>首页</title>
</head>

<body>

    <div id="app">

        <el-container>
            <el-header>
                <span class="nav-right-links">
                    <a href="">首页</a>
                    <a href="">首页</a>
                </span>

                <div class="left-con-users">
                    <div class="user-copns">
                        <el-dropdown @command="handleCommand">
                            <el-avatar class="tx"
                                src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
                            </el-avatar>
                            <el-dropdown-menu slot="dropdown">
                            </el-dropdown-menu>
                        </el-dropdown>
                        <span class="users-options">
                            <span class="log-sp" @click="onClickLogin">登录</span>
                            <span class="set-sp" style="display: none;">设置
                            </span>
                    </div>
                </div>
            </el-header>
            <el-main>
                <div class="introduction">

                </div>
                <el-row>
                    <el-col :span="8">
                        <div class="grid-content bg-purple">
                            <p></p>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="grid-content bg-purple-light">
                            <div class="subment">
                                <h1>似水流年</h1>
                            </div>
                            <div class="syln-content">
                                <h3>命运让我们走到同一天空下，一起追逐，一起成长，一起欢笑，无数个纵情欢乐的白天，无数个推心置腹的夜晚，无数个绚烂而单纯的时刻，我们一起创造，一起经历，一起看着我们走过的一切，在熟悉的校园里，慢慢变成永远的回忆
                                </h3>
                            </div>
                            <img src="static/image/scene.svg" alt="">
                            <el-row class="row-btns">
                                <el-button type="primary" class="log-btn">登录</el-button>
                                <el-button type="success" class="reg-btn">注册</el-button>
                            </el-row>
                            <el-row class="feat-contain">
                                <el-col :span="8"><img class="feat-img" src="static/image/anq.svg" alt="">
                                    <p>储存安全</p>
                                </el-col>
                                <el-col :span="8"><img class="feat-img" src="static/image/yuy.svg" alt="">
                                    <p>快速预览</p>
                                </el-col>
                                <el-col :span="8"><img class="feat-img" src="static/image/exe.svg" alt="">
                                    <p>超大储量</p>
                                </el-col>
                            </el-row>
                            <div class="mb-4">
                                <h2 class="h-atan">各方面都更好</h2>
                                <p>自助分析或临时报告使用户能够开发快速报告，使用户能够分析他们的数据。 </p>
                            </div>
                            <el-row :gutter="20" style="margin-top: 100px; font-size: 17px;">
                                <el-col :span="8">
                                    我有各自的轨迹，如流星，能相聚，共步一段旅程，是缘分，但最终将朝着各自方向渐行渐远，是命运，愿你毕业后的未来更幸福！
                                </el-col>
                                <el-col :span="16">
                                    <el-image :src="src" :fit="contain"></el-image>
                                    <!-- <img src="" alt="" width="900" height="600"> -->
                                </el-col>
                            </el-row>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="right-usy">
                            <div class="grid-login-content">
                                <el-form ref="form" :model="form" label-width="80px">
                                    <el-form-item label="账号">
                                        <el-input v-model="form.accound"></el-input>
                                    </el-form-item>
                                    <el-form-item label="学号">
                                        <el-input v-model="form.usercard"></el-input>
                                    </el-form-item>
                                    <el-form-item label="密码">
                                        <el-input v-model="form.password" type="password"></el-input>
                                    </el-form-item>
                                    <el-form-item>
                                        <el-button type="primary" @click="onSubmit">登录</el-button>
                                        <el-button @click="closeLogin">取消</el-button>
                                    </el-form-item>
                                </el-form>
                            </div>
                        </div>
                    </el-col>
                </el-row>

            </el-main>
            <el-footer>Footer</el-footer>
        </el-container>
    </div>
    <script src="/js/index.js">
    </script>
</body>


</html>